<template>
	<view>
		<view class="">
			<!-- 2.0.19支持autoBack，默认为false -->
			<u-navbar leftText="举报详情" :autoBack="true">
			</u-navbar>
		</view>
		<view class="con-body">
			<view style="padding:20rpx 40rpx;font-size: 25rpx;">请选择举报类型（必填）</view>
			<view class="list_con" v-for="(item,index) in list" :key="index" @click="toselect(item.id)">
				<image class="va_m" v-if="select==item.id" src="https://resourse.cnlhjt.com/upload/20221221/4c34012d516c2f77556ffc216993e2b4.png"></image>
				<image class="va_m" v-else src="https://resourse.cnlhjt.com/upload/20221221/347c7cdebd94a11a9d610d96da725a7c.png"></image>
				<text class="va_m">{{item.name}}</text>
			</view>
			<view style="padding:20rpx;font-size: 25rpx;">填写补充说明（必填）</view>
			<view class="text_con">
				<textarea name="" id="" cols="30" rows="5" placeholder="请填写..."></textarea>
			</view>
			<view class="btn_con" @click="submit">提交</view>
		</view>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	export default {
		data () {
			return {
				select:0,
				list:[
					{
						id:1,
						name:'房源已出租'
					},
					{
						id:2,
						name:'房源不真实'
					},
					{
						id:3,
						name:'价格不真实'
					},
					{
						id:4,
						name:'群组/商改'
					},
					{
						id:5,
						name:'面积不真实'
					},
					{
						id:6,
						name:'其他'
					}
				]
			}
		},
		methods:{
			toselect(id){
				this.select=id
			},
			submit(){
				this.$refs.uToast.show({
					type: 'success',
					message: "提交成功",
					complete() {
						uni.navigateBack({
							delta:2
						})
					}
				})
			}
			
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #f8f8f8;
	}
	.list_con{
		padding:20rpx 40rpx;
		image{
			width:30rpx;
			height:30rpx;
			margin-right:15rpx;
		}
	}
	.text_con textarea{
		width:89%;
		height:160rpx;
		margin-left:3%;
		padding:20rpx;
		border-radius: 15rpx;
		background-color: #fff;
	}
	.btn_con{
		position: fixed;
		bottom:40rpx;
		width:92%;
		left:4%;
		height:70rpx;
		color:#fff;
		text-align: center;
		line-height: 70rpx;
		border-radius: 35rpx;
		background-image: linear-gradient(to right,#008189,#0c515c);
	}
</style>